<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'update.jsp' starting page</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	<!-- 新 Bootstrap 核心 CSS 文件 -->
	<link href="static/css/bootstrap.min.css" rel="stylesheet" />
	<!-- 可选的Bootstrap主题文件（一般不用引入） -->
	<link rel="stylesheet" href="static/css/bootstrap-theme.min.css">
	<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
	<script type="text/javascript" src="static/js/jquery-1.8.3.js"></script>
	<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
	<script type="text/javascript"  src="static/js/bootstrap.min.js"></script>
	<script type="text/javascript">
		$(function(){
			var flag1=true;
			var flag2=true;
			var flag3=true;
			var flag4=true;
			var flag5=true;
			var flag6=true;
			//验证姓名
			$("#name").blur(function() {
				var name = $(this).val();
				$("#yzname").html("");
				if (name == "") {
					$("#yzname").html("姓名不能为空");
					flag1=false;
				} else if (name.length < 2) {
					$("#yzname").html("姓名不能低于2个字符");
					flag1=false;
				} else{
					flag1=true;
				}
			});
			//验证年龄
			$("#age").blur(function() {
				var age = $(this).val();
				$("#yzage").html("");
				if (age == "") {
					$("#yzage").html("年龄不能为空");
					flag2=false;
				} else if (!/^([0-9]|[0-9]{2}|100)$/.test(age)) {
					$("#yzage").html("年龄输入不正确");
					flag2=false;
				} else{
					flag2=true;
				}
			});
			//验证性别
			$("#sex").blur(function() {
				var sex = $(this).val();
				$("#yzsex").html("");
				if (sex == "") {
					$("#yzsex").html("性别不能为空");
					flag3=false;
				} else if (sex.length!=1) {
					$("#yzsex").html("性别格式不正确");
					flag3=false;
				} else{
					flag3=true;
				}
			});
			//验证电话号码
			$("#tel").blur(function() {
				var tel = $(this).val();
				$("#yztel").html("");
				if (tel == "") {
					$("#yztel").html("电话号码不能为空");
					flag4=false;
				} else if (!/\d{11}/.test(tel)) {
					$("#yztel").html("电话号码格式不正确");
					flag4=false;
				} else{
					flag4=true;
				}
			});
			//验证地址
			$("#address").blur(function() {
				var address = $(this).val();
				$("#yzaddress").html("");
				if (address == "") {
					$("#yzaddress").html("地址不能为空");
					flag5=false;
				} else if (address.length<2) {
					$("#yzaddress").html("地址输入不正确");
					flag5=false;
				} else{
					flag5=true;
				}
			});
			//验证生日
			$("#birthday").blur(function() {
				var birthday = $(this).val();
				$("#yzbirthday").html("");
				if (birthday == "") {
					$("#yzbirthday").html("生日不能为空");
					flag6=false;
				} else if (! /^(19|20)\d{2}-(1[0-2]|0?[1-9])-(0?[1-9]|[1-2][0-9]|3[0-1])$/.test(birthday)) {
					$("#yzbirthday").html("生日格式不正确");
					flag6=false;
				} else{
					flag6=true;
				}
			});
			//验证正确提交
			$("#sub").click(function(){
				if(flag1&flag2&flag3&flag4&flag5&flag6){
					$("form").submit();
				}else{
					return false;
				}
			});
		});
	</script>
  </head>
  
  <body>
    <form class="form-horizontal" action="updateStudent.s?currentPage=${page.currentPage }" method="post">
    	<input type="hidden" name="id" value="${stu.id }">
    	<div class="control-group">
			<label class="control-label">姓名：</label>
			<div class="controls">
				<input type="text" name="name" id="name" value="${stu.name }"><span id="yzname" style="color: red;"></span>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">年龄：</label>
			<div class="controls">
				<input type="text" name="age" id="age" value="${stu.age }"><span id="yzage" style="color: red;"></span>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">性别：</label>
			<div class="controls">
				<input type="text" name="sex" id="sex" value="${stu.sex }"><span id="yzsex" style="color: red;"></span>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">电话：</label>
			<div class="controls">
    			<input type="text" name="tel" id="tel" value="${stu.tel }"><span id="yztel" style="color: red;"></span>
    		</div>
    	</div>
    	<div class="control-group">
			<label class="control-label">地址：</label>
			<div class="controls">
				<input type="text" name="address" id="address" value="${stu.address }"><span id="yzaddress" style="color: red;"></span>
			</div>
		</div>
		<div class="control-group">
			<label class="control-label">生日：</label>
			<div class="controls">
				<input type="text" name="birthday" id="birthday" value="${stu.birthday }"><span id="yzbirthday" style="color: red;"></span>
			</div>
		</div>
		<div class="control-group">
    		<div class="controls">
    			<input type="submit"  class="btn" id="sub" value="修改">
    		</div>
    	</div>
    </form>
  </body>
</html>
